<%@ page import="com.hall.utils.UserSession" %>
<%@ taglib prefix="c" uri="http://www.codecoord.com" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="fmt" uri="http://www.codecoord.com/fmt" %>
<html>
<head>
    <meta charset="UTF-8">
    <%--<meta name="viewport" content="width=device-width, initial-scale=1">--%>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">

    <%--使ie兼容es6语法--%>
    <title>会诊大厅</title>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/jquery/jquerymin.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/vue/js/vuemin.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/vue/js/axios.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/static/bootstrap/js/bootstrap-min.js"></script>
    <link href="${pageContext.request.contextPath}/static/layui-v2.6.8/layui/css/layui.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/layui-v2.6.8/layui/layui.js"></script>
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/css/meet1.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrap.css">
    <link type="text/css" rel="stylesheet"
          href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrapfont.css">
    <link type="text/css" rel="stylesheet"
          href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrapSelect.css">
    <script src="${pageContext.request.contextPath}/static/bootstrap/js/bootstrapSelect.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/pop-up.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/live_meeting.css">
    <style>#navbar-default {
        background-color: #71BD71;
    }
        #lightup{
            padding-left: 0;
            padding-right: 0;
            width: 100%;
            margin: auto;
        }
        .table-td1{}
        .table-td2{width: 60%}
        .ico_span{
            opacity:0;
            display: inline-block;
            font-size: 12px;
            border: solid 1px #E8E5E5;
            border-radius: 5px;
            padding: 2px 1px 1px 1px ;
            line-height: 12px;
            position: absolute;
            top: 28.5%;
            left: 75px;
        }
        .btn-success{
            border: none;
        }
        #serch_top{
            padding-left: 0;
            padding-right: 0;
            position: fixed;
            z-index: 1004;
        }
    .btn{
        border: none;
    }
    .btn-group > .btn:first-child{
            border-radius: 0;
            border-right: none;
            border-left: none;
            border-bottom: none;
        }
        .btn{
            padding: 8px 12px;
        }
        #list{
            width: 95%;
            margin: auto;
        }
        .list-group-item{
            background-color: #fafafa;
            border: 1px solid #F5F5F5;
        }
        .bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text{
         margin-right: 5px;
        }
        .dropdown-menu > li > a{
            color: #7e7e7e;
        }
    .dropdown-menu{
        border: none;
        padding: 0;
    }
        #nullpage{
            text-align: center;
            color: #909090;
            position: absolute;
            margin-top: 50px;
            left: 50%;
            transform: translate(-50%);
            -webkit-transform:translate(-50%);
        }
        .layui-unselect{
            margin-right: 1px;
            padding-right: 1px;
            width: 23%;
        }
    .layui-form-onswitch em{
        opacity: 0.0 ;
    }
    .layui-form-switch em {
        opacity: 0.0 ;
    }
    #more>.btn-group>.dropdown-menu{
        display: none;
    }
    #more>.btn-group>.dropdown-backdrop{
        display: none;
    }
        #pp{
            position:relative;
            margin-top: 35px;
        }
        #row2{
            position: relative;
        }
        #more_select{

            box-shadow:0px 1px 1px -1px #000; border-radius:2px;
            z-index: 1004;top: 86px;background-color:#ffffff;width: 100%;height: 240px;position: fixed;
        }
        .layui-form-radio>i{
         margin-right: 2px;
        }
        em{
            padding: 1px;
            padding-right: 3px;
            padding-left: 0;
            border-radius: 5px;
            border: 1px solid #f7afaf;
            margin-right: 3px;
            font-size:12px ;
            float: right;
            background-color: #F7C6C6;
            color: white;
        }
        .panel-default{
            border: 0;
        }
        .panel-heading{
            border: 0;
            background-color: #fafafa !important;
        }
        .container{

        }
        .form-control{
            outline:none;
        }
        #select_4{
            height: 100%;width: 100%;position: fixed;z-index: 1003;display: none;
        }
        .button_hide{
            position: absolute;
            right: 1%;
            top: 4px;
            height: 33px;
            width: 58px;
            z-index: 100;
            opacity: 0;
        }
        .layui-btn-warm{
            position: absolute;
            padding: 0 8px;
            line-height: 20px;
            top:0;
            height: 34px;
        }
        .layui-btn-warm:nth-child(2){
            right: 65px;
        }
        .layui-btn-warm:nth-child(3){
            right: 10px;
         }
        #select_guanli li{
            font-size: 16px;
        }
    </style>
</head>
<body>
<div id="select_4"></div><%--遮罩--%>
<nav id="navbar-default" class="navbar navbar-default top-nabar" role="navigation"
     style="overflow:hidden;position:fixed;top:0;width:100%;z-index:1002;border: 0;height: 50px">
    <div class="row">
        <div class="container-fluid" id="fluid">
            <div class="col-lg-1 col-md-1 col-xs-1 col-sm-1" style=";padding-left: 6px;">
                <a class="navbar-brand" href="javascript:history.back(-1)" style="padding-left: 3px;">
                    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                </a> <%--导航条左侧返回--%>
            </div>
            <%--<div class="col-lg-4 col-md-4 col-xs-4 col-sm-4" style="position: relative">
                <div class="form-group">   &lt;%&ndash;导航条搜索框&ndash;%&gt;
                    <input id="like" type="text" class="form-control" placeholder="搜索内容.." onkeyup="search()"
                           style="position: absolute;bottom: -27px">
                </div>
            </div>--%>
            <div style="padding-top: 15px;padding-left: 0;padding-right: 0;position: absolute;right: 2%">
                <span id="allhallSpan" class="glyphicon glyphicon-list" aria-hidden="true"></span>
            </div>
        </div>
    </div>
</nav>
<div id="fade" class="black_overlay"></div>
<div class="container" style="padding-top: 50px;padding-bottom: 0">  <%--四个下拉选择框--%>
    <div class="row">
        <div id="serch_top" class="col-lg-12 col-md-12 col-xs-12 col-sm-12" style="height:38px">
            <div class="col-lg-3 col-md-3 col-xs-3 col-sm-3 center select_0" style="padding: 0">
                <select class="selectpicker show-tick form-control " data-live-search="true" id="province"
                        onchange="search()">
                    <option value="">省份</option>
                    <c:forEach items="${dbdictList}" var="province">
                        <c:if test="${province.dictType eq 'province'}">
                            <option>${province.dictValue}</option>
                        </c:if>
                    </c:forEach>
                </select></div>
            <div class="col-lg-3 col-md-3 col-xs-3 col-sm-3 center select_0" style="padding: 0">
                <select class="selectpicker show-tick form-control" data-live-search="true" id="hospital"
                        onchange="search()">
                    <option value="">医院</option>
                    <c:forEach items="${dbdictList}" var="hospital">
                        <c:if test="${hospital.dictType eq 'hospital'}">
                            <option>${hospital.dictValue}</option>
                        </c:if>
                    </c:forEach>
                </select></div>
            <div  class="col-lg-3 col-md-3 col-xs-3 col-sm-3 center select_0" style="padding: 0">
                <select class="selectpicker show-tick form-control" data-live-search="true" id="department"
                        onchange="search()">
                    <option value="">科室</option>
                    <c:forEach items="${dbdictList}" var="office">
                        <c:if test="${office.dictType eq 'office'}">
                            <option>${office.dictValue}</option>
                        </c:if>
                    </c:forEach>
                </select></div>
            <div class="col-lg-3 col-md-3 col-xs-3 col-sm-3 center" style="padding:0;outline:none" id="more" onclick="more_select()">
                <select class="selectpicker show-tick form-control" data-live-search="true" id="condition" style="outline:none">
                    <option value="">更多</option>
                    <option>未开始</option>
                    <option>进行中</option>
                    <option>已结束</option>
                </select></div>
        </div>
    </div>
</div>
<!--页面主显示div-->
<h4 id="nullpage">--暂无符合的会诊--</h4>
<div id="pp" class="container">
    <div class="row" id="row2">
        <div id="more_select" class='layui-anim layui-anim-downbit' style="display: none;">
            <form class="layui-form" action="">
            <span style="font-weight: 600;display: block;margin-left: 12px;font-size: 14px">会诊状态</span>
            <div class="layui-form-item" style="margin-bottom: 0">
                <div class="layui-input-block" style="margin-left: 12px">
                    <input type="radio" lay-filter="cond" name="condition" value="未开始" title="未开始" >
                    <input type="radio" lay-filter="cond" name="condition" value="进行中" title="进行中">
                    <input type="radio" lay-filter="cond" name="condition" value="已结束" title="已结束">
                    <input type="radio" lay-filter="cond" name="condition" value="" title="全部" checked="">
                </div>
            </div>
                <span style="font-weight: 600;display: block;margin-left: 12px;font-size: 14px">参会专家</span>
                <div class="layui-form-item" style="margin-bottom: 0">
                    <div class="layui-input-block" style="margin-left: 12px">
                        <input type="radio" lay-filter="exp" name="expert" value="有专家" title="有专家" checked="">
                        <input type="radio" lay-filter="exp" name="expert" value="无专家" title="无专家">
                        <input type="radio" lay-filter="exp" name="expert" value="" title="全部" checked="">
                    </div>
                </div>
                <span style="font-weight: 600;display: block;margin-left: 12px;font-size: 14px">医疗助理</span>
                <div class="layui-form-item" style="margin-bottom: 0">
                    <div class="layui-input-block" style="margin-left: 12px">
                        <input type="radio" lay-filter="assi" name="assistant" value="有医助" title="有医助" checked="">
                        <input type="radio" lay-filter="assi" name="assistant" value="无医助" title="无医助">
                        <input type="radio" lay-filter="assi" name="assistant" value="" title="全部" checked="">
                    </div>
                </div>
                <span style="font-weight: 600;display: block;margin-left: 12px;font-size: 14px">关键字搜索</span>
                <div class="layui-form-item" style="margin-bottom: 0">
                <div class="form-group" style="position: relative">   <%--导航条搜索框--%>
                    <input id="like" type="text" class="form-control" placeholder="搜索内容.." onkeyup="search()"
                           style="width: 60%;margin-left: 10px">
                    <button id="close_serch" type="button" class="layui-btn layui-btn-warm">搜索</button>
                    <button id="clear_serch" type="button" class="layui-btn layui-btn-warm">清除</button>
                </div>
                </div>
            </form>
        </div>
        <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12" id="lightup">
            <c:forEach items="${list}" var="appointment" varStatus="status">
                <div id="list" class="item">
                    <input id="search" hidden
                           value="${appointment.doctorName}${appointment.doctorName}${appointment.title}${appointment.content}
                    ${appointment.reportNum}${appointment.qaMeetNum}(${appointment.id})${appointment.doctorName}${appointment.status}${appointment.appointHospital}${appointment.office}${appointment.status}
                    ${not empty appointment.assistant_id?'有医助,':'无医助,' }${not empty appointment.expertNum? '有专家':'无专家'}">
                            <div class="panel panel-default" style="box-shadow: none">
                        <div class="panel-heading"><span id="meettitle">会诊列表</span>
                           <c:if test="${appointment.status=='nostart'}"><span class="ico_span">未开始</span></c:if>
                            <c:if test="${appointment.status=='ongoing'}"><span class="ico_span">进行中</span></c:if>
                            <c:if test="${appointment.status=='end'}"><span class="ico_span">已结束</span></c:if>
                            <div class="button">
                                <div class="button_hide" style="width: 100%;height: 100%;background-color: #b94a48"></div>
                                <a href="javascript:void(0)" style="text-decoration:none;">
                                    <button type="button" class="btn btn-success" style="line-height: 1.28" onclick="road('${appointment.id}')">详情</button>
                                </a>
                                &nbsp;
                            </div>
                            <div class="button_hide"></div><%--按钮控制--%>
                            <div class="btn-group" id="button-select">
                                <div class="but_hide"></div>
                                <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"
                                        style="background-color: #5cb85c;border:none;border-radius: 4px;line-height: 1.25">操作
                                    <span class="caret"></span>
                                </button>
                                <ul id="select_guanli" class="dropdown-menu dropdown-menu-right" style="min-width:90px" role="menu">
                                    <li class="operate_">
                                        <a href="javascript:void(0)" onclick="checkUser('${appointment.id}')">管理</a>
                                    </li>
                                    <li><a href="javascript:void(0)" onclick="addCollect('${appointment.id}')">收藏</a>
                                    </li>
                                    <%--<li class="as-dc"><a href="/boke/meet_findoneManage.do?reqfrom=app&id=9c9a0"
                                                         >添加医助</a>
                                    </li>
                                    <li class="as-dc"><a href="javascript:void(0)"
                                                         >添加专家</a>
                                    </li>--%>
                                </ul>
                            </div>
                        </div>
                        <ul class="list-group" id="content_news_list">
                            <div></div>
                            <li class="list-group-item">
                                <span>${appointment.doctorName}</span>&nbsp&nbsp&nbsp<span><fmt:formatDate
                                    value="${appointment.applyTime}" pattern="yyyy-MM-dd HH:mm:ss"/></span></li>
                            <li class="list-group-item">会诊:&nbsp&nbsp<span>${appointment.doctorName}</span></li>
                            <li class="list-group-item">标题:&nbsp&nbsp<span>${appointment.title}</span></li>
                            <li class="list-group-item">内容:&nbsp&nbsp<span>${appointment.content}</span></li>
                            <li class="list-group-item">汇报数:&nbsp&nbsp<span>${appointment.reportNum}</span>&nbsp&nbsp专家数:&nbsp<span>${empty appointment.expertNum? 0:appointment.expertNum}</span>
                                <c:if test="${empty appointment.assistant_id}">
                                    <em>无医助</em>
                                </c:if>
                                <c:if test="${empty appointment.expertNum}">
                                    <em>无专家</em>
                                </c:if>
                            </li>
                            <li class="list-group-item">参会医院:&nbsp&nbsp<span>${appointment.appointHospital}</span></li>
                            <li style="border: 0;border-radius: 0 0 3px 3px" class="list-group-item">涉及科室:&nbsp&nbsp<span>${appointment.majors}</span></li>
                            <li class="list-group-item" style="display: none">
                                状态:&nbsp&nbsp<span>${appointment.status}</span></li>
                        </ul>
                    </div>
                </div>
            </c:forEach>
        </div>
    </div>
</div>
<!--底部导航条-->
<footer class="aui-footer aui-footer-fixed" style="z-index: 1005">

    <a href="/boke/index.jsp" class="aui-tabBar-item " style="text-decoration:none;">
        <span class="aui-tabBar-item-icon"><i class="icon icon-loan"></i></span>
        <span class="aui-tabBar-item-text">首页</span></a>

    <a href="/bokehall/hall/allHall" class="aui-tabBar-item aui-tabBar-item-active">
        <span class="aui-tabBar-item-icon"><i class="icon icon-credit"></i></span>
        <span class="aui-tabBar-item-text">会诊</span></a>

    <a href="/boke/msg/chatfriend.jsp" class="aui-tabBar-item ">
        <span class="aui-tabBar-item-icon"><i class="icon icon-ions"></i></span>
        <span class="aui-tabBar-item-text">消息</span></a>

    <a href="/boke/me.jsp" class="aui-tabBar-item "><span
            class="aui-tabBar-item-icon"><i class="icon icon-mine"></i></span>
        <span
                class="aui-tabBar-item-text">我的
        </span></a>
</footer>
<script>
    var user={};
    $(document).ready(function () {
        search();
        eachsturs();
        getlogin();
        closeNag();//隐藏导航
        close();//隐藏导航
        $('#navbar-default').hide();//隐藏导航
        if(user!=null){
            $(".button_hide").hide();
        }
        if (user==null) {
            $("#formm").hide();
            $(".as-dc").hide();
            $('em').hide();
        }else if(user.usertype != "assistant"){
            $("#formm").hide();
            $(".as-dc").hide();
            $('em').hide();
        }
    });

    //弹出框方法
    function show(tag) {
        var light = document.getElementById(tag);
        light.style.display = 'block';
        $("#fade").css('display', 'block');
        $("#like").attr('disabled', true); //点击详情时禁用搜索框
        document.body.parentNode.style.overflowY = "hidden"; //点击详情时禁用纵向滑动条
    }
    function hide(tag) {
        var light = document.getElementById(tag);
        light.style.display = 'none';
        $("#fade").css('display', 'none');
        $("#like").attr('disabled', false);//点击关闭详情时启用搜索框
        document.body.parentNode.style.overflowY = "auto";//点击关闭详情时启用纵向滑动条
    }

    //搜索框和下拉选择框方法
    function search() {
        //获取搜索框值
        var sea = $('#like').val();
        //获取科室下拉框值department
        var department = $('#department option:selected').val();
        //获取医院
        var hospital = $('#hospital option:selected').val()
        //获取省份
        var province = $('#province option:selected').val()
        //获取状态
        var condition = $('#condition option:selected').val()
        //获取单选状态
        var cond=$('input[name="condition"]:checked').val();
        //获取有无专家
        var expert = $('input[name="expert"]:checked').val();
        //获取有无医助
        var assistant =$('input[name="assistant"]:checked').val();

        var arr = new Array();
        if (typeof department != "undefined" && department != null && department != "") {
            arr.push(department);
        }
        if (typeof sea != "undefined" && sea != null && sea != "") {
            arr.push(sea);
        }
        if (typeof hospital != "undefined" && hospital != null && hospital != "") {
            arr.push(hospital);
        }
        if (typeof province != "undefined" && province != null && province != "") {
            arr.push(province);
        }
        if (typeof condition != "undefined" && condition != null && condition != "") {
            arr.push(condition);
        }
        if(typeof cond !="undefined" && cond != null && cond!=""){
            arr.push(cond)
        }
        if(typeof expert !="undefined" && expert != null && expert!=""){
            arr.push(expert)
        }
        if(typeof assistant !="undefined" && assistant != null && assistant!=""){
            arr.push(assistant)
        }
        $("input[id^='search']").each(function () {
            var j = 0;
            for (let i = 0; i < arr.length; i++) {
                if ($(this).val().indexOf(arr[i]) > -1) {
                    j += 1;
                }
            }
            if (j == arr.length) {
                $(this).parent().attr("style", "display:block");
            } else {
                $(this).parent().attr("style", "display:none");
            }
        })
    }
    //收藏
    function addCollect(i) {
        let form = new FormData();
        form.append("appointId", i);
        if (form.get("appointId") != null || form.get("appointId") != '') {
            axios({
                method: "post",
                data: form,
                url: "${pageContext.request.contextPath}/hall/addCollect"
            }).then(function (response) {
                if (response.data.code === 0) {
                    layer.alert(response.data.msg)
                    return false;
                }
                if (response.data.code===1) {
                    layer.alert(response.data.msg)
                    return false;
                }
            }).catch(function (error) {
                layer.alert("出现错误")
            })
        }
    }
    //检查病例详情建议是否添加
    function checkFileIsnull(id) {
        axios({
            method: 'get',
            url: '${pageContext.request.contextPath}/case/caseisnull/'+id,
        }).then(function (response) {
            if(response.data===0){
                alert("该场次会诊暂未添加病例详情及治疗方案")
                return false;
            }
            else{
                window.location.href = '${pageContext.request.contextPath}/case/caseShow?appointmentId='+id;
            }
        })
    }
    //会诊状态显示
    function eachsturs(){
    $(".ico_span").each(function(){
        let status= $(this).text()
        if(status=="已结束"){
            $(this).css("opacity","1");
            $(this).css("color","#F25050")
            $(this).css("background-color","#F7AFAF")
            $(this).css("border","solid 1px #F25050")
        }else if(status=="进行中"){
            $(this).css("opacity","1");
            $(this).css("color","#48BF39")
            $(this).css("background-color","#AFF2AA")
            $(this).css("border","solid 1px #48BF39")
        }else{
            $(this).css("opacity","1");
            $(this).css("background-color","#BCF5F2")
            $(this).css("color","#89C4E8")
            $(this).css("border","solid 1px #89C4E8")
        }
      });
    }
    //控制更多选择框展开
    function more_select(){
       var showState=document.getElementById("more_select").style.display;
        if(showState=="none"){
            $('#more_select').show();
            $("#select_4").show();
        }
        else{
        $('#more_select').hide();
            $("#select_4").hide();
        }
    }
    $("#select_4").click(function () {
        $('#more_select').hide();
        $("#select_4").hide();
    })
    $('.select_0').click(function () {
        $('#more_select').hide();
        $("#select_4").hide();
    })
    //更多
    layui.use(['form'], function () {
        var upload = layui.upload;
        var form = layui.form;
        //此处即为 radio 的监听事件
        form.on('radio(cond)', function(data){
            console.log(data.elem); //得到radio原始DOM对象
            console.log(data.value); //被点击的radio的value值
            search()
        });
        form.on('radio(exp)', function(data){
            console.log(data.elem); //得到radio原始DOM对象
            console.log(data.value); //被点击的radio的value值
            search()
        });
        form.on('radio(assi)', function(data){
            console.log(data.elem); //得到radio原始DOM对象
            console.log(data.value); //被点击的radio的value值
            search()
        });
        form.render();
    });
    //获取当前登录用户对象
    function getlogin() {
        $.ajax({
            type:"get",
            async:false,
            url:'${pageContext.request.contextPath}/user/getLogging',
            contentType: "application/json;charset=utf-8",
            dataType: "json",
            success:function (data) {
               user = data.data;
            },error:function (error) {
                console.log("请求失败")
            }
        })
    }
    $(".button_hide").click(function () {
        layer.msg('未登录或账号登录已过期,请退出并重新登录');
    })
    function GetQueryString(name)
    {
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return unescape(r[2]); return null;
    }
    function closeNag()
    {
        var flutterFlag = GetQueryString("from");
        if( flutterFlag == 'app' )
        {
            $('.container').css("padding-top","0");
            $('#navbar-default').hide();
            $('.aui-footer').hide();
            $('#more_select').css("top","35px")
        }
    }
    function close() {
        $('.container').css("padding-top","0");
        $('#navbar-default').hide();
        $('#more_select').css("top","35px")
    }
    $("#close_serch").click(function () {
            $('#more_select').hide();
            $("#select_4").hide();
    })
    $("#clear_serch").click(()=>{
        $('#like').val('').keyup();
    })
    function road(id) {
        window.location.href="/bokehall/views/meet/meeting_details.html?appointmentId="+id;
    }
    function checkUser(id){
     axios({
         url:"/bokehall/hall/userIdList/"+id,
         method:"get"
     }).then(function (response) {
         if (response.data.code===1){
             window.location.href="/boke/meet_findoneManage.do?reqfrom=app&id="+id;
         }else{
             layer.msg('你不是本场会诊的参与者,无法管理');
         }
     }).catch(function () {
        alert("请重试");
     })
   }
</script>
</body>
</html>
